<nav class="navbar navbar-static-top" (click)="hideNavBar($event)">
  <div class="container">
    <div class="navbar-header collapsed">
      <button type="button" class="navbar-toggle collapsed" aria-expanded="true" aria-controls="navbar"
              (click)="toggleNavBarState($event);">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand navbar-pic" [routerLink]="['./']"><img class="logo" src="./assets/img/wolf2.png" alt="破狼博客"/></a>
    </div>
    <div id="navbar" class="navbar-collapse collapse" [class.in]="showNavBar" aria-expanded="true">
      <ul class="nav navbar-nav">
        <!--<li><a routerLinkActive="active" [routerLink]="['./']" [routerLinkActiveOptions]="{exact: true}">首页</a></li>-->
        <li><a routerLinkActive="active" [routerLink]="['./home']">文章</a></li>
        <li class="dropdown" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" dropdown
            (dropdownStatusChange)="!$event&&hideNavBar()">
          <a class="dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false">站内资源<span
            class="caret"></span></a>
          <ul class="dropdown-menu">
            <li class="dropdown-header">相关资源</li>
            <li><a routerLinkActive="active" [routerLink]="['./question']">我要提问</a></li>
            <li role="separator" class="divider"></li>
            <li class="dropdown-header">著作与翻译</li>
            <li><a routerLinkActive="active"
                   [routerLink]="['./', '2015-12-30-angularjsshen-du-pou-xi-yu-zui-jia-shi-jian-jian-jie.html']">Angularjs深度剖析与最佳实践</a>
            </li>
          </ul>
        </li>
        <li><a routerLinkActive="active" [routerLink]="['./about']">关于我</a></li>
      </ul>
    </div>
  </div>
</nav>
